<template> 
	<view class="container">
		<view class="poster">
			<image :src="poster.img_url" mode="widthFix" lazy-load></image>
		</view>
		
		<view class="friend-invite-footer">
			<view class="friend-invite-bottom">
				<text @click="download_poser()">下载海报图片</text>
				<text @click="shareclick()">分享专属海报</text>
			</view>
		</view>
		
		
		<uni-popup ref="sharepopup" type="bottom">
			<share-btn :sharedataTemp="sharedata"></share-btn>
		</uni-popup>
		
	</view>
</template>

<script>
	import { pathToBase64, base64ToPath } from '../../common/image-tools'
	import uniPopup from '../../components/share/uni-popup/uni-popup'
    import shareBtn from '../../components/share/share-btn/share-btn'
	import poster from '../../common/api/poster'
	import tools from '../../common/tools'
	export default {
		data() {
			return {
				goods_params:{
					title:'',
					monthsale:'',
					endprice:'',
					price:'',
					img_url:'',
					taoword:'',
					couponmoney:'',
					shoptype:'',
				},
				//生成出来的base64的图片
				poster:{
					img_url:'',	//base64图片
					img_path:'',//图片路径
				},
				sharedata:[],
			}
		},
		components:{
			poster,
			shareBtn,
			uniPopup,
			tools
		},
		mounted() {
		},
		onLoad(options) {
			this.get_params(options)
		},
		
		methods: {
			//获取参数
			get_params(options){
				uni.showLoading({
					title: '生成中'
				})
				this.goods_params=JSON.parse(options.goods_params)
				this.goods_poster()
			},
			
			//请求海报图片
			goods_poster(){
				poster.goods_poster(this.goods_params).then(res =>{
					if(res.code == 1){
						this.poster.img_url=res.data.img_url
						this.base64ToImg()
						uni.hideLoading()
					}
				}).catch(cateres =>{
	　　　　　　　　　　uni.showToast({
	　　　　　　　　　　　　title: '生成失败',
	　　　　　　　　　　　　icon: 'none'
	　　　　　　　　　　})
				});
			},
			
			
			//base64图片转图片路径
			base64ToImg(){
				base64ToPath(this.poster.img_url)
					.then(path => {
						this.poster.img_path=path
						this.sharedata.strShareImageUrl=path
					})
					.catch(error => {
						uni.showToast({
							title: '图片生成失败',
							icon: 'none'
						})
					})
			},
			
			
			//下载海报图片
			download_poser(){
				uni.saveImageToPhotosAlbum({     //将图片保存在手机
					filePath:this.poster.img_path,     //保存的位置
					success: (res) => {
						uni.showToast({
							title: '保存成功',
							icon: 'none'
						})
					}
				})
			},
			
			
			//分享
			shareclick(){
				this.$refs.sharepopup.open()	//分享
			},
			
			//复制口令
			duplication(){
				tools.downloadfileimg(this.img_url)
			}
		}
	}
</script>

<style lang="scss">
	page{
		overflow-y: hidden;
		overflow-x: hidden;
	}.poster{
		overflow-y: hidden;
		overflow-x: hidden;
	}
	.poster>image{
		width:750upx;
	}
	.friend-invite-footer{
		width:100%;
		position: fixed;
		right: 0;
		bottom: calc( var(--window-bottom) + 3px);
		left: 0;
		z-index: 1030;
		.friend-invite-bottom{
			width:80%;
			margin:0 auto;
			display: flex;
			flex-direction: row;
			white-space: nowrap;
			justify-content:left;
			flex-wrap:wrap;
			height:80upx;
			line-height:80upx;
		}
		.friend-invite-bottom>text{
			width:50%;
			display:block;
			text-align: center;
			color:#FFFFFF;
		}
		.friend-invite-bottom>text:first-child{
			background-color:#FA436A;
			border-top-left-radius:40upx;
			border-bottom-left-radius:40upx;
		}
		.friend-invite-bottom>text:last-child{
			background-color:#303133;
			border-top-right-radius:40upx;
			border-bottom-right-radius:40upx;
		}
	}
</style>